
<!DOCTYPE html>
<html xmlns:th="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>API测试</title>
    <link href="/static/devtools30/layui/css/layui.css" rel="stylesheet" />
    <link href="/static/devtools30/css/devindexbase.css" rel="stylesheet" />
    <script src="/static/devtools30/js/jquery-1.11.2.min.js" type="text/javascript"></script>
    <script src="/static/devtools30/layui/layui.all.js" type="text/javascript"></script>
    <script src="/static/devtools30/js/devtoolCommon.js" type="text/javascript"></script>
    <link href="/static/devtools30/js/plugins/codemirror-5.14.2/theme/eclipse.css" rel="stylesheet" type="text/css" />
    <link href="/static/devtools30/js/plugins/codemirror-5.14.2/lib/codemirror.css" rel="stylesheet" />
    <script src="/static/devtools30/js/plugins/codemirror-5.14.2/lib/codemirror.js" type="text/javascript"></script>
    <script src="/static/devtools30/js/plugins/codemirror-5.14.2/mode/sql/sql.js" type="text/javascript"></script>
    <script src="/static/devtools30/js/plugins/codemirror-5.14.2/mode/javascript/javascript.js" type="text/javascript"></script>

    <style>
        /*顶部容器*/
        .tophead {
            height: 32px;
            border-bottom: 1px solid #F7F7F7;
            padding: 0 5px;
        }
        /*顶部输入框，下拉框去掉layui默认边距*/
        .tophead .layui-form-item {
            margin-bottom: 0px!important;
        }
        /*顶部输入框，下拉框左边文本样式*/
        .tophead .layui-form-label {
            padding: 0;
            line-height: 25px;
            width: auto;
        }
        /*顶部form块样式*/
        .tophead .layui-input-block {
            margin-left: 62px;
            min-height: 26px;
        }
        /*顶部输入框，下拉框设置高度*/
        .tophead .layui-input,
        .layui-select {
            height: 25px;
        }
        /*顶部下拉框设置子项高度*/
        .tophead .layui-form-select dl {
            top: 26px;
            padding: 0;
        }
        /*顶部下拉框设置子项内容高度*/
        .tophead .layui-form-select dl dd,
        .layui-form-select dl dt {
            line-height: 24px;
        }
        /*.tophead .layui-form-item {*/
        /*    width: 165px;*/
        /*}*/
        /*顶部下拉框图标大小*/
        .tophead .layui-form-select .layui-edge {
            border-width: 4px;
        }
        /*搜索框左边距*/
        .tophead .search .layui-input-block {
            margin-left: 32px;
        }

        /*表格-----------------------------------*/

        /*表格字体大小*/
        .layui-table td,
        .layui-table th {
            font-size: 11px!important;
        }
        /*表格边距*/

        .layui-table,
        .layui-table-view {
            margin: 0;
        }
        /*按钮高度大小*/
        .layui-btn {
            height: 26px;
            line-height: 26px;
            font-size: 11px;
        }
        /*按钮组-------------------------------*/
        /*按钮组左边框*/
        .layui-btn-group .layui-btn-primary:first-child {
            border-left: 1px solid #c9c9c9!important;
        }
        /*按钮组边框*/
        .layui-btn-group .layui-btn {
            border-left: 1px solid rgba(255, 255, 255, .5)!important;
        }
    </style>

</head>
<body>
<div style="height: 100%;background: #F7F7F7;">
    <form class="layui-form" action="" lay-filter="testform">
    <div class="flex flex-align-center flex-jusity-betreen tophead backgroundf">
        <div class=" flex flex-align-center">
            <div class="layui-form-item">
                <label class="layui-form-label marginleft10 ">服务地址</label>
                <div class="layui-input-block">
                    <input type="text" id="serviceurl" name="serviceurl" style="width: 200px;margin-left: 16px;" value="" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item marginleft10 search">
                <label class="layui-form-label">API编码</label>
                <div class="layui-input-block" style="margin-left: 90px">
                    <input type="text" id="apicode" name="apicode" style="width: 200px;"  placeholder="API编码" autocomplete="off" class="layui-input">
                </div>
            </div>

            <span style="margin-left: 20px;color: red">完整请求路径</span>
            <span id="divfullurlshow" style="margin-left: 20px;color: red">

            </span>
        </div>
    </div>
    </form>
    <div class="flex flex-jusity-betreen " style="height:100%;width: 100%;background: #F7F7F7;padding: 3px 0;clear: both;">
        <div class="backgroundf" style="margin-left: 5px;width: 49.8%;height: 100%">
            <div class="colororange padding100">
                请求JSON
                <button type="button" class="layui-btn layui-btn-primary layui-btn-sm btns"
                        style="margin-right: 5px;margin-left: 5px;float: right;line-height: 20px;height: 23px;" name='submittest'>测试提交</button>
            </div>
            <div class="layui-input-block" style="margin-left: 0;width: 100%;height: 100%">
                <textarea name="postJson" id="postJson" placeholder="{}" class="layui-textarea textheight" style="height: 88%"></textarea>
            </div>
        </div>
        <div class="backgroundf" style="margin-left: 5px;;width: 49.8%;height: 100%">
            <div class="colororange padding100">响应JSON</div>
            <div class="layui-input-block" style="margin-left: 0;width: 100%;height: 100%">
                <textarea name="returnJson" id="returnJson" placeholder="{}" class="layui-textarea textheight" style="height: 88%"></textarea>
            </div>
        </div>
    </div>

</div>

<script type="text/html" id="mygrid2bar">
    <a style="color: #409EFF;margin-left: 10px" href="#" lay-event="deletearg">删除</a>
</script>

<script>
    var height = dlCommon.getWinHeight();
    var width=dlCommon.getWinWidth();
    var argArray=[];
    var argsGridTable=null;
    $(function() {
        initEvent();
        initForm();
        loadDemoJson();
    })

    function loadDemoJson() {

        var testformValue = layui.form.val('testform');
        var url=testformValue.serviceurl+'/ApiUpdateService';
        url=url+"?p_dm="+testformValue.apicode;
        $("#divfullurlshow").html(url);

        dlCommon.getJSON(testformValue.serviceurl + "/DevtApiTjoptEntityController/getDemoJsonByPid?pid="+testformValue.apicode,{},function (resdata) {
            if(!resdata.success){
                dlCommon.layerError(res.msg);
                return;
            }
            $("#postJson").val(resdata.data.jsonstrOne);
            // $("#postJsonAry").val(resdata.data.jsonstrAry);
        })


    }

    function initForm() {
        var domain = document.domain;
        //获取当前网址，
        var curPath = window.document.location.href;
        //获取主机地址之后的目录，
        var pathName = window.document.location.pathname;
        var pos = curPath.indexOf(pathName);
        //获取主机地址
        var localhostPaht = curPath.substring(0, pos);
        //获取带"/"的项目名，
        var projectName = pathName.substring(0, pathName.substr(1).indexOf('/') + 1);

        $("#serviceurl").val(localhostPaht)

        if(dlCommon.getUrlParam("p_dm")){
            $("#apicode").val(dlCommon.getUrlParam("p_dm"));
        }

        layui.form.render();
    }

    //初始化事件
    function initEvent(){
        layui.table.on('tool(mygrid2)', function (obj) {
            var row = obj.data;
            var argname = row.argname;
            var argvalue = row.argvalue;
            if (obj.event === 'deletearg') {
                argArray.forEach((item,index,argArray) => {
                    if(item.argname===argname){
                        argArray.splice(index,1);
                    }
                });
            }
        });
        //按钮点击
        $('.btns').on('click', function() {
            var names = $(this)[0].name;

            if(names == 'submittest') {

                var testformValue = layui.form.val('testform');
                if(testformValue.serviceurl==null||testformValue.serviceurl.trim()==''){
                    dlCommon.layerInfo('服务地址');
                    return;
                }
                if(testformValue.apicode==null||testformValue.apicode.trim()==''){
                    dlCommon.layerInfo('请输入apiid或获取apicode');
                    return;
                }
                var url=testformValue.serviceurl+'/ApiUpdateService';
                url=url+"?p_dm="+testformValue.apicode;

                $("#divfullurlshow").html(url);

                $("#returnJson").val('');
                __loadingindex = dlCommon.Loading();
                $.ajax({
                    url: url,
                    data:  $("#postJson").val(),
                    type: 'post',
                    contentType: 'application/json; charset=utf8',
                    success: function (data) {
                        layer.close(__loadingindex);
                        if (data == null) {
                            return;
                        }
                        if (typeof data == 'string') {
                            $("#returnJson").val(data)
                        }else{
                            $("#returnJson").val(JSON.stringify(data, null ,2))
                        }
                    },
                    error: function (xhr) {
                        alert("出错了!" + xhr.Message);
                        layer.close(__loadingindex);
                    },
                    complete: function (XHR, TS) {
                        XHR = null
                        layer.close(__loadingindex);
                    }
                });
                return;
            }
        })
    }

</script>
</body>
</html>
